(() => {
  // 引入vantCDN资源
  // vant.Toast("提示");
  // Vue.use(vant.Lazyload);
  let ele = {};
  ele.body_nei = $("#body_nei");
  ele.img_bei = $("#img_bei");
  ele.top_img = $("#top_img");
  ele.zanwujilu = $("#zanwujilu");
  let list = ["", ""];
  if (list.length == 0) {
    console.log(11111);
    ele.body_nei.style.backgroundColor = "#f7efde";
    openMdl(ele.img_bei);
    closeMdl(ele.body_nei);
  }
  //点击返回按钮
  ele.top_img.onclick = () => {
    history.back();
  };
  // 调用函数执行请求
  initAjax();
  function initAjax() {
    let token = getCookie("token");
    ajax({
      method: "get",
      url: API_PATH.RECORD,
      header: {
        Authorization: token,
      },
      success: (res) => {
        console.log(res, 5555);
        list = res.data;
        if (res.data.length == 0) {
          openMdl(ele.zanwujilu);
        }
        // 渲染数据
        initTample();
      },
      error: (err) => {
        // openTips(err.msg);
      },
    });
  }
  function initTample() {
    imgList = ["green", "blue", "purple", "red", "orange"];
    let newList = list
      .map((item, index) => {
        let n = ` 
      <div class="pr_box">
      <!-- 上部分 -->
    <div class="ben">
      <p>${item.created_at.split(" ")[0]}</p>
    </div>
    <!-- 中间部分 -->
    <div class="pr_center">
      <div class="left">
        <div class="l_top">
          <span>奖励金币个数：</span><span>${item.money}</span><span>个</span>
          <img id="lingqu" data-id="${
            item.qi_num
          }" src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/${
          item.state == 1 ? "yilingqu" : "lqu"
        }.png" alt="" />
        </div>
        <!-- 中间图片 -->
        <div class="img">
          <div class="top_tit">最大</div>
          <img
            src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/130x90_${
              imgList[item.max.ks_id - 1]
            }.png"
            alt=""
          />
          <div class="bott_tit">${item.max.num}平米</div>
        </div>
        <!-- 下方钱 -->
        <div class="bootom_bt">
          <img src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/jinbi.png" alt="" />
          <span>${item.max.money}个</span>
        </div>
        <!-- 下方钱 -->
        <div class="bootom_bton">
          <span>每个矿工奖励</span>
          <img src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/jinbi.png" alt="" />
          <p>${item.max.pj_money}</p>
          <span>个</span>
        </div>
      </div>
      <div class="left">
        <div class="l_top">
          <span>投入矿工人数：</span><span>${item.num}</span><span>人</span>
        </div>
        <!-- 中间图片 -->
        <div class="img">
          <div class="top_tit">最小</div>
          <img
            src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/130x90_${
              imgList[item.min.ks_id - 1]
            }.png"
            alt=""
          />
          <div class="bott_tit">${item.min.num}平米</div>
        </div>
        <!-- 下方钱 -->
        <div class="bootom_bt">
          <img src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/jinbi.png" alt="" />
          <span>${item.min.money}个</span>
        </div>
        <!-- 下方钱 -->
        <div class="bootom_bton">
          <span>每个矿工奖励</span>
          <img src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/jinbi.png" alt="" />
          <p>${item.min.pj_money}</p>
          <span>个</span>
        </div>
      </div>
    </div>
    <!-- 下方的 -->
    <div class="par_bot">我的投入（单位：人）</div>
    <!-- 下方的山的介绍 -->
    <div class="introduce">
      <div class="introduce_box">
        <img
          src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/314x216-green.png"
          class="introduce_img"
          alt=""
        />
        <div >
        <div data-id="1" id="pos_tit${index}" class="pos_tit" ><p>最高</p></div>
        <div class="introduce_name" data-id="1" id="introduce_name${index}">0人</div>
        </div>
      </div>
      <div class="introduce_box">
        <img
          src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/314x216-blue.png"
          class="introduce_img"
          alt=""
        />
        <div >
        <div data-id="2" id="pos_tit${index}" class="pos_tit" ><p>最高</p></div>
        <div class="introduce_name" data-id="2" id="introduce_name${index}">0人</div>
        </div>
      </div>
      <div class="introduce_box">
        <img
          src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/314x216-purple.png"
          class="introduce_img"
          alt=""
        />
        <div >
        <div data-id="3" id="pos_tit${index}" class="pos_tit" ><p>最高</p></div>
        <div class="introduce_name" data-id="3" id="introduce_name${index}">0人</div>
        </div>
      </div>
      <div class="introduce_box">
        <img
          src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/314x216-red.png"
          class="introduce_img"
          alt=""
        />
        <div >
        <div data-id="4" id="pos_tit${index}" class="pos_tit" ><p>最高</p></div>
        <div class="introduce_name" data-id="4" id="introduce_name${index}">0人</div>
        </div>
      </div>
      <div class="introduce_box">
        <img
          src="http://img.qxgs.cc/tiantianlaishouzu/img/investmentIn_mines/314x216-orange.png"
          class="introduce_img"
          alt=""
        />
        <div>
        <div data-id="5" id="pos_tit${index}" class="pos_tit" ><p>最高</p></div>
        <div class="introduce_name" data-id="5" id="introduce_name${index}">0人</div>
        </div>
      </div>
    </div>
    </div>
`;

        return n;
      })
      .join(" ");
    ele.body_nei.innerHTML = newList;
    list.forEach((item, index) => {
      let biaoAll = document.querySelectorAll(`#pos_tit${index}`);
      biaoAll.forEach((ite, ind) => {
        if (ite.dataset.id == item.max.ks_id) {
          ite.innerHTML = ` <p>最高</p>
  `;
        } else if (ite.dataset.id == item.min.ks_id) {
          ite.innerHTML = `<p>最少</p>
  `;
        } else {
          closeMdl(ite);
          ite.innerHTML = ` <p>最少</p>`;
        }
      });
      // !渲染人数
      let introduce_nameAll = document.querySelectorAll(
        `#introduce_name${index}`
      );
      console.log(introduce_nameAll);
      introduce_nameAll.forEach((i, d) => {
        item.ks_list.forEach((t) => {
          if (t.ks_id == i.dataset.id) {
            i.innerHTML = t.num + "人";
          }
        });
      });
    });
    // !领取请求
    let lingquAll = document.querySelectorAll("#lingqu");
    lingquAll.forEach((item) => {
      item.onclick = () => {
        lingqu(item.dataset.id);
      };
    });
  }
  function lingqu(id) {
    let token = getCookie("token");
    ajax({
      method: "post",
      url: API_PATH.KUANSSSLING,
      header: {
        Authorization: token,
      },
      data: {
        qi_num: id,
      },
      success: (res) => {
        openTips(res.msg);
        initAjax();
      },
      error: (err) => {
        // openTips(err.msg);
      },
    });
  }
})();
